<!DOCTYPE html>
<html>

<head>
    <title>Preview Display</title>
    <meta charset="UTF-8">
    <link rel="shortcut icon" href="custom/images/favicon.ico?v=2" />
    <style>
        html,
        body {
            padding: 0px;
            margin: 0px;
        }
    </style>
    <script src='../libs/core/IZrowIfUVaXF.js'></script>
    <script src='../libs/core/VT3MIEkV8AKv.js'></script>
    <script src='../libs/core/ht.js'></script>
    <script src='../libs/core/buckle.js'></script>
    <script src='../libs/core/ht-ui.js'></script>

    <script src='../libs/plugin/ht-edgetype.js'></script>
    <script src="../libs/plugin/ht-obj.js"></script>
    <script src='../libs/plugin/ht-form.js'></script>
    <script src='../libs/plugin/ht-vector.js'></script>
    <script src='../libs/plugin/ht-animation.js'></script>

    <script src='../configs/htconfig.js'></script>

    <!-- <script src="../libs/china.js"></script> -->
    <script src="../libs/echarts.min.js"></script>
    <script src='../libs/echarts.js'></script>
    <script src='../libs/jquery-3.4.1.min.js'></script>
    <script src='../libs/echarts.js'></script>
    <script src='../libs/buckle.js'></script>
    <script src='../libs/knU3sXefAa5Q.js'></script>
	 <script src="../configs/urlConfig.js"></script>
    <script>
        var dataModel = new ht.DataModel();
        var secondsTimeOne=0;
        var secondsTimeTwo=0;


        function init() {
            var gd2 = new ht.graph.GraphView();
            gd2.addToDOM();
            graphView = new ht.graph.GraphView(dataModel);
            graphView.addToDOM(gd2.getView());
            gd2.deserialize('displays/冀北/涉网/修改1.json', function (json, dm, g2d, datas) {
                // TODO 2D 反序列化完成回调，后面会讲到
                var val = new Array();
                val = updateDataModel(getUrl.url1);
                createNodes(dm, val);

                gd2.addInteractorListener(e => {
                    var kind = e.kind;
                    var data = e.data;

                    var id = data._id;
                    var temp;
                    for (var i = 0; i < val.length; i++) {
                        if (val[i].id == id)
                            temp = val[i];
                        if (temp) {

                            var position = data._position;
                            var detail1 = dm.getDataByTag('detail1');
                            var detail2 = dm.getDataByTag('detail2');

                            if ('onHover' == kind) {
                                if (temp.type == 1) {
                                    detail1._position.x = position.x + 100;
                                    detail1._position.y = position.y - 60;
                                    detail1.a('title', temp.name + "场站");
                                    detail1.a('content', temp.content);
                                    detail1.s('2d.visible', true);
                                } else if (temp.type == 2) {
                                    detail2._position.x = position.x+100;
                                    detail2._position.y = position.y-60;
                                    detail2.a('title', temp.name + "场站");
                                    detail2.a('content', temp.content);
                                    detail2.s('2d.visible', true);
                                }
                            } else if ('onLeave' == kind) {
                                detail1.s('2d.visible', false);
                                detail2.s('2d.visible', false);
                            }
                        }

                    }

                });

            });



            //  序列化整个页面

            graphView.deserialize('displays/冀北/涉网/powergr.json', function (json, dm, g2d, datas) {

                //获取时间数据

                var time = (new Date).getTime() - 24 * 60 * 60 * 1000;
                var yesday = new Date(time); // 获取的是前一天日期
                //字符串拼接转格式：例如2019-08-19
                var today = yesday.getFullYear() + "-" + (yesday.getMonth() > 9 ? (yesday.getMonth() + 1) : + (yesday.getMonth() + 1)) + "-" + (yesday.getDate() + 1 > 9 ? (yesday.getDate() + 1) : "0" + (yesday.getDate() + 1));
                //  var htval1=dataModel3.getDataByTag('todayTime1').a('ht.value');
                dataModel.getDataByTag('todayTime1').a({
                    'ht.value': today
                });
                var afterTomorrow = yesday.getFullYear() + "-" + (yesday.getMonth() > 9 ? (yesday.getMonth() + 1) : + (yesday.getMonth() + 1)) + "-" + (yesday.getDate() + 3 > 9 ? (yesday.getDate() + 3) : "0" + (yesday.getDate() + 1));
                dataModel.getDataByTag('todayTime2').a({
                    'ht.value': afterTomorrow
                });

             //获取第一个时间框里的时间
                var dataTime1=dataModel.getDataByTag('todayTime1');
                time1=dataTime1.a('ht.value');
                var secondsTime1=new Date(time1).getTime();
                secondsTimeOne = secondsTime1;

                //获取第二个时间框里的时间

                var dataTime2=dataModel.getDataByTag('todayTime2');
                time2=dataTime2.a('ht.value');
                var secondsTime2=new Date(time2).getTime();
                secondsTimeTwo = secondsTime1;



                //  场站预警个数统计
                var changNum = dataModel.getDataByTag('changNum');
                var val1 = new Array();
                val1 = updateDataModel(getUrl.url2);
                var list1 = new Array();

                for (var i = 0; i < val1.length; i++) {
                    var obj = new Object();
                    obj.name = val1[i].electricStationName;
                    obj.value = val1[i].count;
                    list1.push(obj);
                }
                changNum.a('data', list1);

                // 场站预警排行top5
                var changOrder = dataModel.getDataByTag('changOrder');
                var val2 = new Array();
                var data = new Array();
                var ydata = new Array();
                val2 = updateDataModel(getUrl.url3);
                for (var i = 0; i < val2.length; i++) {
                    var obj = new Object();
                    obj.name = val2[i].electricStationName;
                    ydata.push(obj.name);
                    obj.value = val2[i].count;
                    data.push(obj.value);
                }
                changOrder.a('data', data);
                changOrder.a('ydata', ydata);

                //发电单元脱网数量
                var changTuo = dataModel.getDataByTag('changTuo');
                var val3 = new Array();
                var list3 = new Array();
                val3 = updateDataModel(getUrl.url5);

                for (var i = 0; i < val3.length; i++) {
                    var obj = new Object();
                    obj.name = val3[i].electricStationName;
                    obj.value = val3[i].count;
                    list3.push(obj);
                }
                changTuo.a('data', list3);


                //预警,脱网事故记录

                var lunbo = dataModel.getDataByTag('lunbo');
                var val4 = new Array();
                var list4 = new Array();
                val4 = updateDataModel(getUrl.url6);

                for (var i = 0; i < val4.length; i++) {
                    var obj = new Object();
                    obj.icons = "";
                    obj.times = val4[i].date;
                    obj.contents = val4[i].alertOrAccidentInfo;
                    list4.push(obj);
                }
                lunbo.a('table.dataSource', list4);


                //  点击事件
                graphView.addInteractorListener(e => {

                    var bl1=graphView.dm().getDataByTag('bl1');
                    var v1=bl1.s('2d.visible');
                    var br1=graphView.dm().getDataByTag('br1');
                    var v2=br1.s('2d.visible');
                    var bl3=graphView.dm().getDataByTag('bl3');
                    var v3=bl3.s('2d.visible');
                    var br4=graphView.dm().getDataByTag('br4');
                    var v4=br4.s('2d.visible');

                    if (v3 && e.kind === 'clickData' && e.data && e.data.getTag() === 'bl2') {
                        setData(getUrl.url2,getUrl.url3);


                    } else if (v4 && e.kind === 'clickData' && e.data && e.data.getTag() === 'bl2') {
                        setData(getUrl.url8,getUrl.url9);

                    } else if (v3 && e.kind === 'clickData' && e.data && e.data.getTag() === 'br2'){

                        setData(getUrl.url4,getUrl.url7);

                    } else if (v4 && e.kind === 'clickData' && e.data &&( e.data.getTag() === 'br2')) {

                        setData(getUrl.url10,getUrl.url11);


                    } else if ( v1&& e.kind === 'clickData' && e.data && (e.data.getTag() === 'bl4')) {

                        setData(getUrl.url2,getUrl.url3);

                    } else if ( v2 && e.kind === 'clickData' && e.data && (e.data.getTag() === 'bl4')) {

                        setData(getUrl.url4,getUrl.url7);
                    } else if ( v1 && e.kind === 'clickData' && e.data && (e.data.getTag() === 'br3')) {

                        setData(getUrl.url8,getUrl.url9);
                    } else if( v2 && e.kind === 'clickData' && e.data && (e.data.getTag() === 'br3')) {
                        setData(getUrl.url10,getUrl.url11);
                    }
            })
        })
        }



        //  预警场站个数与TOP5的数据接入
        function   setData(u1,u2){
            var changNum = dataModel.getDataByTag('changNum');
            var val6 = new Array();
            val6 = updateDataModel(u1);
            var list6 = new Array();

            for (var i = 0; i < val6.length; i++) {
                var obj = new Object();
                obj.name = val6[i].electricStationName;
                obj.value = val6[i].count;
                list6.push(obj);
            }
            changNum.a('data', list6);


            var changOrder = dataModel.getDataByTag('changOrder');
            var val2 = new Array();
            var data = new Array();
            var ydata = new Array();
            val2 = updateDataModel(u2);
            for (var i = 0; i < val2.length; i++) {
                var obj = new Object();
                obj.name = val2[i].electricStationName;
                ydata.push(obj.name);
                obj.value = val2[i].count;
                data.push(obj.value);
            }
            changOrder.a('data', data);
            changOrder.a('ydata', ydata);

        }

        var getUrl = {
            url1:attributeConfig.url+"/epplatform/v1/alertMap",
            url5:attributeConfig.url+"/epplatform/v1/countOffGridUnits?startTime="+secondsTimeOne+"&endTime="+secondsTimeTwo,
            url6:attributeConfig.url+"/epplatform/v1/alertOrAccidentRecords?startTime="+secondsTimeOne+"&endTime="+secondsTimeTwo,
            url2:attributeConfig.url+"/epplatform/v1/alertsCount?alertType=1&stationType=1&startTime="+secondsTimeOne+"&endTime="+secondsTimeTwo,
            url3:attributeConfig.url+"/epplatform/v1/alertsCount/top5?alertType=1&stationType=1&startTime="+secondsTimeOne+"&endTime="+secondsTimeTwo,
            url4:attributeConfig.url+"/epplatform/v1/alertsCount?alertType=2&stationType=1&startTime="+secondsTimeOne+"&endTime="+secondsTimeTwo,
            url7:attributeConfig.url+"/epplatform/v1/alertsCount/top5?alertType=2&stationType=1&startTime="+secondsTimeOne+"&endTime="+secondsTimeTwo,
            url8:attributeConfig.url+"/epplatform/v1/alertsCount?alertType=1&stationType=2&startTime="+secondsTimeOne+"&endTime="+secondsTimeTwo,
            url9:attributeConfig.url+"/epplatform/v1/alertsCount/top5?alertType=1&stationType=2&startTime="+secondsTimeOne+"&endTime="+secondsTimeTwo,
            url10:attributeConfig.url+"/epplatform/v1/alertsCount?alertType=2&stationType=2&startTime="+secondsTimeOne+"&endTime="+secondsTimeTwo,
            url11:attributeConfig.url+"/epplatform/v1/alertsCount/top5?alertType=2&stationType=2&startTime="+secondsTimeOne+"&endTime="+secondsTimeTwo,
        };




        function createNodes(dm, datas) {
            for (var i = 0; i < datas.length; i++) {
                //debugger
                var node = new ht.Node();
                node.setLayer('2');
                if (datas[i].type == 2) {
                    node.setImage('assets/标切/涉网性能-标切/椭圆 6 拷贝 7.png');   //红警
                } else {
                    node.setImage('assets/标切/涉网性能-标切/椭圆 6 拷贝 4.png');      //黄警
                }


                 var temp = datas[i];
                 var positionx= 4*(temp.latigute)*(temp.latigute) - 806.5*(temp.latigute) + 40616;
                 var positiony = 64.122*(temp.longitude)*(temp.longitude) - 5331.9*(temp.longitude) + 111266;

//                var positionx = temp.latigute - 500;
//
//                var positiony = temp.longitude;
                if (temp) {
                    //设置图元矩形区域
                    node.setRect(positionx, positiony, 40, 40);
                }
                node.setId(temp.id);
                node.s('2d.visible', true);
                node.s('interactive', true);
                dm.add(node);
            }
        }

        // 获取后台数据
        var values=new Array();
        function updateDataModel(geturl){
            $.ajax({
                type : "GET",
                async : false, //同步请求
                url : geturl,
                contentType: "application/json; charset=utf-8",
                success:function(data){

                    if(data.code==0){
                        values = data.data;
                    }
                },
                error: function() {
                    alert("失败，请稍后再试！");
                }
            });
            return  values;
        }
    </script>
</head>

<body onload='setInterval(init(), 3000)' >
</body>

</html>